<!-- 用于显示每个测试项（一个数据集）的情况 -->
<template>
    <a-popover
        style="width: 500px"
        title="Hover title"
        trigger="click"
    >
        <template #content>
            <!-- <div>{{detail}}</div> -->
            <!-- <a-timeline>
                <a-timeline-item :color="item[0]" >{{item[1]}}</a-timeline-item>
            </a-timeline> -->
            <status-tag v-for="(v, k) in latest" :key="k" :text="k+': '+v"></status-tag>
        </template>
        <!-- <a-popover
            title="Click title"
            trigger="click"
            :visible="clicked"
        >
            <template #content>
                <div>
                    <div>This is click content.</div>
                    <a @click="hide">Close</a>
                </div>
            </template> -->
            <!--  -->
            <db-avatar :count="hiscnt" :status="status" :name="database" :short="'2324.3GB'"></db-avatar>
        <!-- </a-popover> -->
    </a-popover>
</template>

<script>
/* eslint-disable */
function parse2(){

}
import DbAvatar from './DbAvatar.vue'
import StatusTag from './StatusTag.vue'
export default {
    name: 'TestInfo',
    props: {
        test: String,
        dataset: String,
        database: String,
    },
    components: { StatusTag, DbAvatar },
    data(){
        return {
            loading: true,
            status: 'normal',
            content: 'PG 2020536 GB',
        }
    },
    async created(){
        // console.log(this.test, this.dataset, this.database)
        
    },
    methods:{
        close(){
            
        }
    },
    computed:{
        latest(){
            return this.history[0]
        },
        history(){
            return this.$store.state.results.filter(t=>(t.test==this.test && t.dataset==this.dataset && t.db.toLowerCase()==this.database.toLowerCase())).sort((a,b)=>{
                if(a.createdAt > b.createdAt) return -1
                else return 1
            })
        },
        historyBref(){
            return this.history.map(item=>[ null, item.createdAt])
        },
        hiscnt(){
            return this.history.length
        },
    }
}
</script>

<style scoped>

</style>
